<!-- 表格内容 BEGIN -->
<div class="table-margin checkbox-public">
  <div class="table-header">
    <table class="table table-bordered table-header tableStyle">
      <thead>
        <tr>
          <td class="w5 text-center">
            <input type="checkbox" #event (click)="selectAll(event.checked,tabVal)" [checked]="isSelectAll" />
          </td>
          <td class="w5 text-center max-w" >序号</td>
          <td class="w15 text-left max-w">角色编码</td>
          <td class="w20 text-left max-w">角色名称</td>
          <td class="w10 text-left max-w">角色组</td>
          <td class="w10 text-left max-w">自动分配</td>
          <td class="w20 text-left max-w">描述</td>
          <td class="w15 text-left max-w">操作</td>
        </tr>
      </thead>
    </table>
  </div>
    <div class="table-body">
      <table class="table table-bordered table-header overflow-table no-border table-striped">
        <tbody>
          <tr *ngFor="let val of tabVal; let  i = index;" [ngClass]="{'active':i%2!=0}">
            <td class="w5 text-center">
              <input type="checkbox" #event (click)="chose(event.checked, val.roleId, val.length)" [checked]="isChose" />

            </td>
            <!--<td class="text-center">{{ val.roleId }}</td>-->
            <td class="w5 text-center">{{tableNumber+i+1}}</td>
            <td class="w15 text-left max-w" title="{{val.roleCode}}">{{val.roleCode}}</td>
            <td class="w20 text-left">
              <input type="text" name="roleName" class="form-control" [(ngModel)]="val.roleName"  maxlength="20" (blur)="role_blur()" (keyup)="role_focus(val)" [class.erinput]="val.roleName == ''"
                (ngModelChange)="checkname($event)" [disabled]="!right['role']['update']">
            </td>
            <td class="w10 text-left">
              <select class="form-control select-style" [(ngModel)]="val.roleGroupId" (change)="autoclick(val)" [disabled]="!right['role']['update']">
                <!-- <option value="">未选择</option> -->
                <option *ngFor="let item of rolesData" [value]='item.roleGroupId'>{{item.roleGroupName}}</option>
              </select>
            </td>
            <td class="w10 text-left">
              <!-- <select [(ngModel)]="val.autoAssignment" (change)="autoclick(val)" [disabled]="!right['role']['update']">
                <option [value]='0'>不是</option>
                <option [value]='1'>是</option>
              </select> -->
              <label class="toggle toggle-positive">
                <input type="checkbox" (change)="autoclick(val)" [disabled]="!right['role']['update']"  [(ngModel)]="val.autoAssignment" >
                <div class="track">
                    <div class="tit" *ngIf="val.autoAssignment">是</div>
                    <div class="tit right" *ngIf="!val.autoAssignment">不是</div>
                    <div class="handle"></div>
                </div>
              </label>  
            </td>
            <td class="w20 text-left">
              <input type="text" class="form-control" [disabled]="!right['role']['update']" maxlength="50" [(ngModel)]="val.description" (blur)="role_blur()" (keyup)="role_focus(val)" [class.erinput]="val.description == ''">
            </td>
            <td class="w15 text-center icon-td">
              <!-- <span class="btn-i border-none" title="功能授权" (click)="getRoleLimit(val.roleId)" *ngIf="right['role']['functionalAuthorization']">
                <img width="20px" height="18px" src="assets/right-product/user.png">
              </span> -->
              <span class="btn-i" title="详情" (click)="detailsPopup(val)" *ngIf="right['role']['details']">
                <img width="14px" height="10px" src="assets/right-product/view.png">
              </span>
              <span class="btn-i border-none" title="关联用户"(click)="getRoleId(val.roleId)" *ngIf="right['role']['associatedUser']">
                <img width="23px" height="23px" src="assets/right-product/user-one.png">
              </span>
              <!-- *ngIf="right['role']['functionalAuthorization']" -->
              <span class="btn-i border-none" title="功能授权" (click)="getRoleLimit1(val.roleId)"  data-toggle="modal" data-target="#roleLimitTree" *ngIf="right['role']['functionalAuthorization']" >
                <img width="20px" height="18px" src="assets/right-product/user.png">
              </span>
            </td>
          </tr>
          <tr>
            <!-- <td colspan="12" class="text-center" ng-hide="isNoData">暂无数据</td> -->
          </tr>
        </tbody>
      </table>
    </div>
</div>
<!-- 表格内容 END -->
